/**
 * 游戏HUD
 * 负责处理游戏中HUD的交互逻辑
 */
class GameHUD {
    constructor(game) {
        // 游戏实例引用
        this.game = game;
        
        // HUD元素
        this.hudElement = document.getElementById('game-hud');
        
        // 打字区域
        this.typingArea = document.getElementById('typing-area');
        
        // 文本显示区域
        this.textDisplay = document.getElementById('text-display');
        
        // 光标元素
        this.cursor = document.getElementById('cursor');
        
        // 游戏场景
        this.gameScene = document.getElementById('game-scene');
        
        // 初始化事件监听
        this.initEventListeners();
    }
    
    /**
     * 初始化事件监听
     */
    initEventListeners() {
        // 键盘输入事件
        document.addEventListener('keydown', (event) => {
            // 如果游戏正在运行
            if (this.game.isRunning && !this.game.isPaused) {
                // 处理按键输入
                this.handleKeyInput(event);
            }
        });
        
        // ESC键暂停游戏
        document.addEventListener('keydown', (event) => {
            if (event.key === 'Escape' && this.game.isRunning) {
                if (this.game.isPaused) {
                    this.game.resume();
                } else {
                    this.game.pause();
                }
            }
        });
        
        // 空格键使用道具
        document.addEventListener('keydown', (event) => {
            if (event.key === ' ' && this.game.isRunning && !this.game.isPaused) {
                // 阻止空格键滚动页面
                if (event.target === document.body) {
                    event.preventDefault();
                }
                
                // 使用道具
                this.game.itemManager.useItem();
            }
        });
    }
    
    /**
     * 处理键盘输入
     * @param {KeyboardEvent} event 键盘事件
     */
    handleKeyInput(event) {
        // 阻止默认行为，防止页面滚动等
        if (event.key !== 'Escape') {
            event.preventDefault();
        }
        
        // 将按键传递给打字管理器
        this.game.typingManager.handleInput(event.key);
    }
    
    /**
     * 显示文本
     * @param {string} text 要显示的文本
     */
    displayText(text) {
        if (!this.textDisplay) return;
        
        // 清空文本显示区域
        this.textDisplay.innerHTML = '';
        
        // 将文本拆分为字符并添加到显示区域
        for (let i = 0; i < text.length; i++) {
            const charSpan = document.createElement('span');
            charSpan.textContent = text[i];
            charSpan.dataset.index = i;
            this.textDisplay.appendChild(charSpan);
        }
        
        // 重置光标位置
        this.updateCursor(0);
    }
    
    /**
     * 更新文本显示
     * @param {number} position 当前位置
     * @param {boolean} isError 是否为错误
     */
    updateTextDisplay(position, isError = false) {
        if (!this.textDisplay) return;
        
        // 获取所有字符元素
        const charElements = this.textDisplay.querySelectorAll('span');
        
        // 更新字符状态
        charElements.forEach((charSpan, index) => {
            // 清除所有状态类
            charSpan.classList.remove('typed', 'current', 'error');
            
            if (index < position) {
                // 已输入的字符
                charSpan.classList.add('typed');
            } else if (index === position) {
                // 当前字符
                if (isError) {
                    charSpan.classList.add('error');
                } else {
                    charSpan.classList.add('current');
                }
            }
        });
        
        // 更新光标位置
        this.updateCursor(position);
    }
    
    /**
     * 更新光标位置
     * @param {number} position 当前位置
     */
    updateCursor(position) {
        if (!this.cursor || !this.textDisplay) return;
        
        // 获取当前字符元素
        const charElements = this.textDisplay.querySelectorAll('span');
        const currentChar = charElements[position];
        
        if (currentChar) {
            // 获取字符位置
            const charRect = currentChar.getBoundingClientRect();
            const textRect = this.textDisplay.getBoundingClientRect();
            
            // 设置光标位置
            this.cursor.style.left = `${charRect.left - textRect.left}px`;
            this.cursor.style.top = `${charRect.top - textRect.top}px`;
            this.cursor.style.height = `${charRect.height}px`;
            
            // 显示光标
            this.cursor.style.display = 'block';
        } else if (position >= charElements.length && charElements.length > 0) {
            // 如果到达文本末尾，将光标放在最后一个字符后面
            const lastChar = charElements[charElements.length - 1];
            const charRect = lastChar.getBoundingClientRect();
            const textRect = this.textDisplay.getBoundingClientRect();
            
            this.cursor.style.left = `${charRect.right - textRect.left}px`;
            this.cursor.style.top = `${charRect.top - textRect.top}px`;
            this.cursor.style.height = `${charRect.height}px`;
            
            // 显示光标
            this.cursor.style.display = 'block';
        } else {
            // 隐藏光标
            this.cursor.style.display = 'none';
        }
    }
    
    /**
     * 显示游戏HUD
     */
    show() {
        // 可以添加显示动画等
    }
    
    /**
     * 隐藏游戏HUD
     */
    hide() {
        // 可以添加隐藏动画等
    }
} 